import React, { Component } from 'react'
import {CProduct} from '../../types/product'
import {baseUrl} from '../../util/url'
import './car-item.scss'
import {connect} from 'react-redux'

interface IProps{
    item:CProduct,
    changeCheck:(id:number,checked:boolean)=>void
}
class CarItem extends Component<IProps> {
    render() {
        let {title,price,num,checked,id,img} = this.props.item;
        return (
            <div className="car-item-wrap">
                <input type="checkbox" checked={checked} onChange={() => {
                    this.props.changeCheck(id,!checked)
                }}/>
                <img src={baseUrl+img} alt=""/>
                <div>
                    <h5>{title}</h5>
                    <span>价格:{price}</span>
                    <div>
                        <span>-</span>
                        <span>{num}</span>
                        <span>+</span>
                    </div>
                </div>
            </div>
        )
    }
}
let stateMapToProps = () => {return {}};

let dispatchMapToProps = (dispacth:any) => {
    return {
        changeCheck(id:number,checked:boolean){
            dispacth({type:'CHANGE_CHECK',id,checked})
        }
    }
}

export default connect(stateMapToProps,dispatchMapToProps)(CarItem)